<%@ page language="java" pageEncoding="UTF-8"%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ page import="java.util.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<style type="text/css">
<!--
.mydiv {
	margin-top: 10px;
	margin-bottom: 10px;
}


-->
</style>

<div class="span12">

	<form id="addForm" action='<c:url value="/concept-manage/add" />'
		class="form-horizontal" method="post">
		<fieldset>
			<c:if test="${message != null }">
				<div class="alert alert-success">
					<c:out value="${message }" />
				</div>
			</c:if>

			<legend>新增概念（更新概念启动顺序是按照表单顺序作为启动顺序）</legend>
			<div class="control-group">
				<label class="control-label" for="行业名">概念名</label>
				<div class="controls">
					<input class="input-large" name="conceptName" placeholder="请输入概念名">
				</div>
			</div>

			<div class="control-group">
				<label class="control-label" for="保存按照下列概念的顺序保存">概念启动顺序</label>
				<div class="controls" id="corIndGroup">
					<a href="#" onclick="newline()"><span>新增概念</span></a>
				</div>
			</div>

			<div class="control-group">
				<div class="controls">
					<button type="submit" class="btn">保存</button>
					<a  href='<c:url value="/concept-manage/" />' class="btn">返回</a>
				</div>
			</div>

		</fieldset>
	</form>

</div>

<script type="text/javascript">
	function newline() {
		var idstr = new Date().getTime();
		$("#corIndGroup")
				.append(
						"<div class='mydiv'><input type='text' class='input-large' name='corConceptName' id='" 
				+ idstr 
				+ "'><a href='#' style='margin-left:12px;' onclick=\"deleteline('"
								+ idstr + "')\">X</a></div>");

		//必须返回一个false，取消<a>的点击动作
		// 不然的话，触发了a的点击动作，就会把新增的元素刷掉
		return false;
	}

	function deleteline(id) {
		$('#' + id).parent().remove();
	}
	
	 $(document).ready(function(){   
	    	//defaults
	    	$.validator.setDefaults({
	    		submitHandler: function(form) {    
	    			form.submit();    
	    		}
	    	});
	    	
	    	//begin to validate
	    	$('#addForm').validate({  
	    		rules: {
	    			conceptName:{
	    				required:true
	    			}
	    		},
	    		messages:{
	    			conceptName: {       
	    				required:"请输入概念名"
	    			}
	    		}
	    	});
	    });
	    
</script>


